.task-allot-auto {
  height: 100%;
  padding: 20px;
  &-header {
    display: flex;
    justify-content: flex-start;
    padding-bottom: 24px;
    .el-button {
      max-width: 200px !important;
      @include text-ellipsis();
    }
  }
  &-match {
    @include fontColor();
  }
  &-nomatch {
    color: $text-color-primary;
  }
  &-item {
    .el-checkbox {
      margin-left: 10px;
    }
  }
  &-empty {
    height: 200px;
    line-height: 200px;
    text-align: center;
    user-select: none;
  }
  &-button {
    display: flex;
    justify-content: center;
  }
}

.task-allot-auto {
  .base-timeline-head {
    height: 28px;
    width: 28px;
    left: -16px;
    line-height: 28px;
    text-align: center;
    &-no-match {
      background-color: #fff !important;
      border: 1px solid #E6E6E6;
      color: $text-color-secondary;
      &:hover {
        background-color: #fff !important;
      }
    }
    &-before,
    &-match {
      border: none !important;
      background: linear-gradient(180deg, #2BE3E3 0%, $color-primary 100%);
      color: #fff;
      &:hover {
        @include backgroundColorImportant();
      }
    }
  }
  .base-timeline-item-before {
    border-color: $color-primary;
  }
  &-item-name {
    cursor: pointer;
  }
}

.task-allot-auto-content {
  background-color: $bg-color-l2;
  border-radius: 4px;
  max-height: calc(100% - 60px);
  padding: 20px;
  position: relative;
  overflow-y: auto;
  .base-timeline {
    height: calc(100% - 20px);
  }
  .ui-input-block {
    background-color: $bg-color-l2;
    border: none;
    cursor: pointer;
  }
}

.task-allot-auto-item {
  .open-data {
    margin-right: 0;
  }
}